<!doctype html>
<html>
	<head>
		<title>mchub - new</title>
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"></script>
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css">
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.2.2/font/bootstrap-icons.css">
		<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js"></script>
	</head>
	<body>
		{% load static %}
		<nav class="navbar navbar-light bg-light">
			<div class="navbar-header">
				<a href="/" class="navbar-brand">
					<img src="{% static 'images/icon.png' %}" class="rounded-sm" width="30" height="30">
					mchub&nbsp;&nbsp;
				</a>
			</div>
			<form class="form-inline">
				<button class="btn btn-link"><a href="/">Explor</a></button>
				{% if not logined %}
				<button class="btn btn-outline-primary"><a href="/signup/">Sign up</a></button>
				{% endif %}
				{% if logined %}
				<div class="dropdown">
					<a class="dropdown-toggle" href="#" role="button" id="u" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
						<b class="bi bi-people-circle" style="font-size: 120%"></b>
					</a>
					<div class="dropdown-menu dropdown-menu-sm-right" aria-labelledby="u">
						<a href="#" class="dropdown-item"><span>Signed in as<br>
							<b>{{ username }}</b></span></a>
						<div class="dropdown-divider"></div>
						<a class="dropdown-item" href="#">Settings</a>
						<a class="dropdown-item" href="/logout/">Log out</a>
					</div>
				</div>
				{% endif %}
			</form>
		</nav>
		<div class="m-3 p-1">
			<h1>Create a new project</h1>
			{% if existed %}
			<p class="text-danger">Project name existed!</p>
			{% elif not_available %}
			<p class="text-danger">Project name not available!</p>
			{% endif %}
			<form action="/new/" method="post">
				{% csrf_token %}
				<div class="input-group mb-3">
					<div class="input-group-prepend">
						<span class="input-group-text" id="prefix">
							<b class="text-danger">*&nbsp;</b>/project/{{ username }}/
						</span>
					</div>
					<input type="text" class="form-control col-sm-3" id="name" placeholder="project name" name="name" aria-label="projname" aria-describedby="prefix" required>
				</div>
				<hr>
				<div class="form-group row">
					<label class="col-sm-2 col-form-label" for="desp">Description</label>
					<input class="col-sm-6 form-control" id="desp" placeholder="Description" name="desp">
				</div>
				<hr>
				<button type="submit" class="btn btn-primary">Create project</button>
			</form>
		</div>
		<footer>
			<hr>
			<p class='m-1' id="footer">Build with <a href="https://www.djangoproject.com/">Django 3.1.4</a>.</p>
		</footer>
	</body>
</html>
